<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
%>
<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
    <meta name="copyright" content="Tencent"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta name="author" content="social-touch.com"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
	<title>药品评价</title>
	<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/demo/public.css" />
	<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/demo/base.css" />
	<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/demo/style.css" />
	<style type="text/css">
	.box span{
	float: left;
    width: 20px;
    height: 20px;
    background: url(<%=path%>/hplus/img/star.png) no-repeat 0 -20px;
    background-size: 20px 40px;
    margin: 0 6px;
    cursor: pointer;
}
	</style>
</head>
<body>
	<div class="evaluate_body">
		<div class="s_header">
			<p><span>王鑫</span> 您好:</p>
			<div class="s_con">
				<p>您在 <span>2017年6月6日 康盛大药房广安门店</span>购买了药品</p>
				<p>药品: <i>强力枇杷露 2盒，阿莫西林 1盒</i></p>
			</div>
		</div>

		<div class="evaluate">
			<h5>评价领取5元优惠券</h5>
			<p></p>
		</div>

		<div class="evaluate_con">
			<dl class="s_content fix" id="globalEva">
				<dt style="margin-top:25px;">整体评价</dt>
				<dd>
					<p class="smile"><img src="<%=path%>/hplus/img/smile.png" /><span >满意</span></p>
					<p class="cry"><img src="<%=path%>/hplus/img/cry.png" /><span >不满意</span></p>
				</dd>
			</dl>
			<dl class="s_content">
				<dt>药品疗效</dt>
				<dd>
					<div class="box J_xstar" id="effectService">
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<i class="very_good">非常好</i>
						<i class="good">好</i>
						<i class="bad">差</i>
					</div>

				</dd>
			</dl>
			<dl class="s_content">
				<dt>药师服务</dt>
				<dd>
					<div class="box J_xstar" id="medicineService">
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<i class="very_good">非常好</i>
						<i class="good">好</i>
						<i class="bad">差</i>
					</div>
				</dd>
			</dl>
			<dl class="s_content">
				<dt>门店服务</dt>
				<dd>
					<div class="box J_xstar" id="storeService">
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<span class=""></span>
						<i class="very_good">非常好</i>
						<i class="good">好</i>
						<i class="bad">差</i>
					</div>
				</dd>
			</dl>
		</div>

		<ul class="evaluate_con1 fix">
			<li>疗效好</li>
			<li>价格合理</li>
			<li>药师专业</li>
			<li>态度友好</li>
			<li>诚信药店</li>
			<li>认真</li>
		</ul>
		<p>其他</p>
		<textarea placeholder="请输入评价" id="description"></textarea>		
		<div class="phone_btn" id="commit">提交</div>
	</div>
	<script type="text/javascript" src="<%=path%>/hplus/js/jquery-1.8.1.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/js/jquery.dataTables.min.js"></script>
	<script src="<%=path%>/hplus/js/plugins/suggest/bootstrap-suggest.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
    <script src="<%=path%>/hplus/js/plugins/sweetalert/sweetalert2.min.js"></script>
	<script type="text/javascript" src="<%=path%>/bm/js/dialog.js"></script>
	<script type="text/javascript" src="<%=path%>/js/marketing/public.js"></script>
	<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
    <script>
	    var path = "<%=path%>";
	    var access_token=$.cookie('access_token');
	   	var cid=$.cookie('cid');
	   	//var uid=$.cookie('uid');
	   	var cid=getQueryString('cid');
	   	var id=getQueryString("orderId");
	   	var ruleId=getQueryString("ruleId");
		var ip=returnCitySN["cip"]+','+returnCitySN["cname"];
		var clickUrl=path+"/ser/evaluate/click";
	   	var url=path+"/ser/order/findOrder";	   	
	   	var globalEva;
	   	var description;
	   	var detail;
	   	var tags;
	   
	   	$(function(){
	   		initData();
	   		$.post(clickUrl,{"cid" : cid,
        		"order_id":id,"rule_id":ruleId,"browse_ip":ip});
	   	});
	   	$("#commit").click(function(){
	   		getData();
	   		var commitUrl=path+"/ser/evaluate/addEvaluate";
	   		$.post(commitUrl,{
	   			"access_token" : access_token,
        		"cid" : cid,
        		"order_id":id,
        		"globalEva":globalEva,
        		"description":description,
        		"detail":detail,
        		"tags":tags,
        		"ruleId":ruleId
	   		},function(data){
	   			console.log(data);
	   			data=JSON.parse(data);
	   			if(data.message_code==0){
	   				window.location.href=path+"/ser/ui/success?cid="+cid+"&cid="+cid;
	   			}else{
	   				alert(data.message);
	   			}
	   		});
	   	});
	   	function initData(){
	   		$.post(url,{"access_token" : access_token,
        		"cid" : cid,
        		"id":id},function(data){
        			data=JSON.parse(data);
        			initExplain(data);
        		});
	   	}
	   	function initExplain(data){
	   		var option="";
	   		if(data!=null){
	   			option+="<p><span>"+data.consumer_name+"</span> 您好:</p><div class='s_con'>";
				option+="<p>您在 <span>"+data.trade_time+" "+data.store_name+"</span>购买了药品</p><p>药品: ";
				option+="<i>";
				var json=JSON.parse(data.goods_name);
				for(var i=0;i<json.length;i++){		
					if(i+1==json.length){
						option+=json[i].goodsName+" "+json[i].purchaseQuantity+"盒";
					}else{
						option+=json[i].goodsName+" "+json[i].purchaseQuantity+"盒,";
					}
				}
				option+="</i></p></div>";
				console.log(option);
				$(".s_header").html(option);
	   		}
	   	}
	   	function getData(){
	   		globalEva=$("#globalEva").children("dd").children(".s_on").children("span").html();
	   		if(globalEva="满意"){
	   			globalEva=5;
	   		}else if(globalEva="不满意"){
	   			globalEva=-5;
	   		}else{
	   			globalEva=0;
	   		}
	   		var effectScore=$("#effectService").children("span[class='on']").length;
	   		var medicineScore=$("#medicineService").children("span[class='on']").length;
	   		var storeScore=$("#storeService").children("span[class='on']").length;
	   		detail=effectScore+","+medicineScore+","+storeScore;
	   		tags=getTag();
	   		description=$("#description").val();
	   		console.log("globalEva---->"+globalEva);
	   		console.log("detail---->"+detail);	   		
	   		console.log("tags---->"+tags);
	   		console.log("description---->"+description);	   		
	   	}
/* 	   	function getEva(score){
	   		if(score=="5"){
	   			return "非常好";
	   		}else if(score=="4"){
	   			return "好";
	   		}else{
	   			return "差"+score;
	   		}
	   	} */
	   	function getTag(){
	   		var n=$(".fix").children("li[class='s_on']").length;
	   		var option="";
	   		for(var i=0;i<n;i++){
	   			if(i<n-1){
		   			option+=$(".fix").children("li[class='s_on']").eq(i).text()+",";	
	   			}else{
		   			option+=$(".fix").children("li[class='s_on']").eq(i).text();	

	   			}	   			
	   		}
	   		return option;
	   	}
	 </script>
	<script>
	    $('.evaluate_con1 li').click(function () {
            var $this = $(this);
            if ($this.hasClass('s_on')) {
                $this.removeClass('s_on');
            } else {
                $this.addClass('s_on');
            }
        });

		$('.smile').click(function(){
            var $this = $(this);
            if( $this.hasClass('s_on') ){ 
                $this.removeClass('s_on');
                $this.find('img').attr('src','<%=path%>/hplus/img/smile.png');
            }else{
                $this.addClass('s_on');
                $this.siblings().removeClass('s_on');
                $this.find('img').attr('src','<%=path%>/hplus/img/smile_on.png');
                $('.cry').find('img').attr('src','<%=path%>/hplus/img/cry.png');
            } 
        });
        $('.cry').click(function(){
            var $this = $(this);
            if( $this.hasClass('s_on') ){ 
                $this.removeClass('s_on');
                $this.find('img').attr('src','<%=path%>/hplus/img/cry.png');
            }else{
                $this.addClass('s_on');
                $this.siblings().removeClass('s_on');
                $this.find('img').attr('src','<%=path%>/hplus/img/cry_on.png');
                $('.smile').find('img').attr('src','<%=path%>/hplus/img/smile.png');
            } 
        });

        $('.J_xstar span').click(function(){
			var $this = $(this),
				index = $this.index();
			if(!$this.hasClass('on')){
				$this.addClass('on');
				if(index > 0){
					$this.prevAll().addClass('on');	
				};
			}else{
				$this.nextAll().removeClass('on');
			};
			if(index == 4){
				$this.parent().find('.very_good').show();
				$this.parent().find('.good,.bad').hide();
			}else if(index == 3){
				$this.parent().find('.good').show();
				$this.parent().find('.very_good,.bad').hide();
			}else{
				$this.parent().find('.bad').show();
				$this.parent().find('.very_good,.good').hide();
			}
        });
	</script>
</body>
</html>